<template>
  <div>
    <a-upload
      name="file"
      :multiple="true"
      :headers="headers"
      :action="uploadUrl"
      @change="handleChange"
      :remove="beforeRemove"
      :customRequest="chunkUpload"
    >
      <a-button> <a-icon type="upload" /> Click to Upload </a-button>
    </a-upload>
  </div>
</template>

<script>
import chunkUpload from "./axios_http/chunkupload";
export default {
  data() {
    return {
      uploadUrl: "http://192.168.1.65:8000/myapp/uploadburstfile/",
      chunkUpload: chunkUpload,
      headers: {
          authorization: 'authorization-text',
      },
    };
  },
  methods: {
    beforeRemove(file) {
      // 如果正在分片上传，则取消分片上传
      if (file.percentage !== 100) {
        this.$store.getters.chunkUploadXhr.forEach((item) => {
          item.abort();
        });
      }
    },
    handleChange(info) {
      if (info.file.status !== 'uploading') {
        // console.log(info.file, info.fileList);
      }
      if (info.file.status === 'done') {
        this.$message.success(`${info.file.name} file uploaded successfully`);
        console.log(info)
        console.log('成功')
        if(info.code==200){
          var file_name = info.filename
          var task = info.task
          mergefile({
            file:file_name,
            task:task
          }).then((res)=>{
            console.log(res.code)
          })
        }
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} file upload failed.`);
        console.log(info)
      }
    },

  },
};
</script>